<%--
  Created by IntelliJ IDEA.
  User: 李威
  Date: 2021/10/5
  Time: 13:37
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" %>
<%@ taglib uri="http://java.sun.com/jstl/core_rt" prefix="c" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>订单详情</title>
    <link href="${pageContext.request.contextPath}/css/index.css" rel="stylesheet">
    <link href="${pageContext.request.contextPath}/css/common.css" rel="stylesheet">
    <link href="${pageContext.request.contextPath}/css/order/order_detail.css" rel="stylesheet">
    <script src = "${pageContext.request.contextPath}/js/jquery-3.3.1.min.js"></script>
    <link href="http://r1nxp2i0y.hn-bkt.clouddn.com/images/ico.png" rel="icon" type="image/x-ico"/>

</head>
<body>
<jsp:include page="../message.jsp"/>
<%--${serverResponse}--%>

<div>
    <!--=======================================1. 标题================================================-->
   <jsp:include page="../util/top.jsp"/>
    <!--        --------------------位置提示信息------------------------->
    <div class="w1180">
        <div id="crumbs">
            <div  style="    position: relative;
    left: -634px;" class="crumbs-bd">
                当前位置:
                <a href="">我的小橘</a>
                &gt;
                <a href="">订单管理</a>
                &gt; 订单详情
            </div>
        </div>
        <div id = "content">
            <div class="content-bd">
                <div class="col-sub">
                    <dl class="sub-nav">
                        <dt>我的订单</dt>
                        <dd><a href="${pageContext.request.contextPath}/to_my_order">订单管理</a></dd>
                        <dt>我的资产</dt>
                        <dd><a>账户余额</a></dd>
                        <dd><a href="${pageContext.request.contextPath}/myCoupon/${loginCustomer.custId}">我的优惠券</a></dd>
                        <dd><a href="${pageContext.request.contextPath}/favorite/${loginCustomer.custId}">我的收藏</a></dd>
                        <dt>个人中心</dt>
                        <dd><a href="${pageContext.request.contextPath}/user_center/${loginCustomer.custId}">用户信息</a></dd>
                        <dd><a>申请注销账户</a></dd>
                    </dl>
                </div>
                <div class="col-main">
                    <!--                        订单基本信息-->
                    <div class="order-status status-orange">
                        <h2 class="pay-status">
                            <c:if test="${serverResponse.data.myOrder.status == 2}">
                                已支付
                            </c:if>
                            <c:if test="${serverResponse.data.myOrder.status == 3}">
                                待支付
                            </c:if>
                            <c:if test="${serverResponse.data.myOrder.status == 4}">
                                已取消
                            </c:if>
                        </h2>
                        <div class="order-info">
                            订单号：<a href="">${serverResponse.data.myOrder.myOrderNumber}</a> &nbsp;&nbsp;
                            <span>|</span>&nbsp;&nbsp;  租车人：<a href="">${serverResponse.data.myOrder.getterName}</a> &nbsp;&nbsp;
                            <span>|</span>&nbsp;&nbsp;支付方式：在线支付
                        </div>
                    </div>
                    <div class="mod car-info">
                        <div class="ui-bfc-hd car-info-img">
                            <div class="car-img">
                                <img src="${serverResponse.data.car.carImagePath}">
                                <p class="p1">租期：</p>
                                <span>${serverResponse.data.myOrder.myOrderLeaseDays}</span>
                                <p>天</p>
                            </div>
                        </div>
                        <div class="ui-bfc-bd car-info-detail">
                            <h1>
                                ${serverResponse.data.car.carName}/${serverResponse.data.car.carShiftType}/${serverResponse.data.car.carType}/${serverResponse.data.car.carDisplacement}/${serverResponse.data.car.carAirInletMode}

                            </h1>
                            <table>
                                <tbody>
                                <tr>
                                    <th colspan="2">取车地点</th>
                                    <th colspan="2">还车地点</th>
                                </tr>
                                <tr>
                                    <td class="left">取车门店：</td>
                                    <td class="cell-cnt">
                                        ${serverResponse.data.storeBorrow.storeCity}
                                        ${serverResponse.data.storeBorrow.storeName}
                                    </td>
                                    <td class="left">还车门店：</td>
                                    <td width="40%" class="cell-cnt">
                                        ${serverResponse.data.storeReturn.storeCity}
                                        ${serverResponse.data.storeReturn.storeName}
                                    </td>
                                </tr>
                                <tr>
                                    <td>取车时间：</td>
                                    <td class="cell-cnt" id="J_PickupTime">
                                        <fmt:formatDate value="${serverResponse.data.myOrder.getCarTime}" pattern="yyyy-MM-dd HH:mm:ss"/></td>
                                    <td>还车时间：</td>
                                    <td class="cell-cnt" id="J_DropoffTime">
                                        <fmt:formatDate value="${serverResponse.data.myOrder.returnCarTime}" pattern="yyyy-MM-dd HH:mm:ss"/></td>
                                </tr>
                                <tr>
                                    <td>取车地点：</td>
                                    <td class="cell-cnt">${serverResponse.data.storeBorrow.storeDetailAddress}</td>
                                    <td>还车地点：</td>
                                    <td class="cell-cnt">${serverResponse.data.storeReturn.storeDetailAddress}</td>
                                </tr>
                                </tbody>
                            </table>
                        </div>
                    </div>
                    <div class="J_priceDetail">
                        <div class="mod price-info">
                            <div class="hd">
                                <h2>费用明细</h2>
                            </div>
                            <div class="bd">
                                <div class="price-info-item">
                                    <div class="price-info-item-hd">

                                        <h3>
                                            车辆租赁费及门店服务费 <span class="insurance-count"></span>
                                        </h3>
                                        <p>
                                            <span class="ui-rmb">¥</span>
                                            <span class="ui-rmb">${serverResponse.data.car.carDailyPrice * serverResponse.data.myOrder.myOrderLeaseDays}</span>
                                        </p>
                                    </div>
                                </div>
                                <div class="price-info-item">
                                    <div class="price-info-item-hd">
                                        <h3>基本保障服务费<span class="insurance-count"></span>
                                        </h3>
                                        <p><span class="ui-rmb">¥</span>${serverResponse.data.myOrder.myOrderLeaseDays * 50}</p>
                                    </div>
                                </div>
                                <div class="price-info-item">
                                    <div class="price-info-item-hd service-cost">
                                        <h3>其它服务费<span class="insurance-count"></span></h3>
                                        <p>
                                            <span class="ui-rmb">¥</span>20
                                        </p>
                                    </div>
                                </div>
                                <div class="price-info-item">
                                    <ul class="added-list-detail">
                                        <!--手续费及其它费用-->
                                        <li>
                                            <p class="tit">手续费--------------------------------------------------------------------------------------------------------------------------------------
                                            </p>
                                            <p class="cnt">
                                                <span class="ui-rmb">¥</span>20

                                            </p>
                                        </li>
                                        <!--订单增值服务价格明细-->
                                        <!--订单的其他费用明细-->
                                    </ul>
                                </div>
                                <div class="price-info-item">
                                    <div class="price-info-item-hd">
                                        <h3>优惠折扣</h3>
                                        <p>
                                            <span class="ui-rmb">¥</span>-<span>
                                            ${serverResponse.data.car.carDailyPrice * serverResponse.data.myOrder.myOrderLeaseDays + 20 + serverResponse.data.myOrder.myOrderLeaseDays * 50 - serverResponse.data.myOrder.myOrderPrice}</span>
                                        </p>
                                    </div>
                                    <div class="dashed-border db-gray-normal"></div>
                                </div>
                                <div class="price-totalbox">
                                    <div class="price-totalintro">
                                        <div class="price-total">
                                            总计：<span><em>¥</em>${serverResponse.data.myOrder.myOrderPrice} </span>
                                        </div>
                                    </div>
<%--                                    <div class="price-totalinfo">--%>
<%--                                        <div class="pay-wait">--%>
<%--                                            待支付：<span class="pricenum"><em>¥</em>${serverResponse.data.car.carDailyPrice * serverResponse.data.myOrder.myOrderLeaseDays + 20 + serverResponse.data.myOrder.myOrderLeaseDays * 50}</span>--%>
<%--                                        </div>--%>

<%--                                        <div class="pay-already">--%>
<%--                                            已支付：<span class="pricenum"><em>¥</em>0</span>--%>
<%--                                        </div>--%>
<%--                                    </div>--%>
                                </div>
                            </div>
                        </div>
<%--                        <div class="order-remark">--%>
<%--                            <div class="hd">--%>
<%--                                <input type="checkbox" disabled="disabled">--%>
<%--                                <span>备注</span>--%>
<%--                                <a id="remarkUpdate" href="javascript:void(0)" data-type="1">修改&gt;&gt;</a>--%>
<%--                                <p id="J_Remark"></p>--%>
<%--                            </div>--%>
<%--                        </div>--%>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="footer">
    <div class="footer-box clear_float">
        <div class="footer-left">
            <p>
                <a href="" >关于小橘</a>
                |
                <a href="" >移动客户端</a>
                |
                <a href="" >帮助中心</a>
                |
                <a href="" >建议专区</a>
                |
                <a href="" >联系我们</a>
                |
                <a href="" >友情链接</a>
                | &nbsp;投诉通道：400-821-1608 &nbsp;
            </p>
            <p>
                Copyright © 2007 - 2021 苏州小橘信息技术服务有限公司
                <a href="" >ICP证：沪B2-20140130</a>
            </p>
        </div>
        <div class="footer-right">
            <a href="">
                <img src="http://r1nxp2i0y.hn-bkt.clouddn.com/images/footer_right_first.png">
            </a>
            <a href="">
                <img src="http://r1nxp2i0y.hn-bkt.clouddn.com/images/footer_right_second.png">
            </a>
            <a href="">
                <img src="http://r1nxp2i0y.hn-bkt.clouddn.com/images/footer_right_third.png">
            </a>
            <a href="">
                <img src="http://r1nxp2i0y.hn-bkt.clouddn.com/images/footer_right_forth.png">
            </a>
        </div>
    </div>
</div>

<script>
    var paymentStatus = "${serverResponse.data.myOrder.status}";
    if(paymentStatus == 2){
        $(".pay-status").text("已支付") ;
    }else if(paymentStatus == 3){
        $(".pay-status").text("待支付") ;
    }else if(paymentStatus == 4){
        $(".pay-status").text("已取消") ;
    }

</script>
</body>
</html>
